<template>
 <view>
	<u-swipe-action>
		<view class="" v-for="item in list" :key="item.id">
			<u-swipe-action-item :options="options2" :name="item.id" @click="handleActions">
				<view class="swipe-action u-border-bottom p32">
					<view class="swipe-action__content flex justify-between">
						<view class="swipe-action__custom mr12">
							<view class="">
								<text class="swipe-action__content__name mr12">{{item.name}}</text>
								<text class="swipe-action__content__text">{{item.phone}}</text>
								<text class="swipe-action__badge ml12" v-if="item.is_default">默认</text>
							</view>
							<view class="">{{item.province}} {{item.city}} {{item.county}} {{item.address}}</view>
						</view>
						<u-icon name="edit-pen" size="28"></u-icon>
					</view>
				</view>
			</u-swipe-action-item>
		</view>
	</u-swipe-action>
	<view class="btn-new-address" @click="toCreateAddress">+ 新增收货地址</view>
 </view>
</template>

<script>
import { addressList, addressRemove, addressDefault } from '@/config/api'
export default {
  data() {
   return {
		 	show: false,
      options2: [{
				text: '设为默认',
				style: {
					backgroundColor: '#3c9cff'
				}
			}, {
				text: '删除',
				style: {
					backgroundColor: '#f56c6c'
				}
			}],
			list: []
   }
  },
	onLoad() {
		this.getData()
	},
	methods: {
		click() {
			console.log(111)
		},
		// select_address_id 123
		async getData() {
			const res = await addressList()
			this.list = res.data
		},
		toCreateAddress() {
			this.$u.route({
				url: 'pages/address/add'
			})
		},
		handleActions({name, index}) {
			// const backUrl = uni.getStorageSync('back_url') || 'pages/index/index'
			console.log(name, index)
			if(index == 1) { // 删除
				uni.showModal({
					title: '温馨提示',
					content: '确定要删除吗？',
					success: res => {
						if (res.confirm) {
							this.removeAddress(name)
						}
					}
				})
			}
			if(index == 0) { // 设为默认
				this.defaultAddress(name)
			}
		},
		async removeAddress(id) {
			// await addressRemove(id)
		},
		async defaultAddress(id) {
			await addressDefault(id)
			this.getData()
			// this.show = false
		}
	}
}
</script>

<style lang="scss" scoped>
.btn-new-address {
  width: 600rpx;
  height: 72rpx;
  line-height: 72rpx;
  text-align: center;
  margin: auto;
  position: fixed;
  left: 50%;
  margin-left: -300rpx;
  bottom: 40rpx;
  border-radius: 36rpx;
  font-size: 28rpx;
  color: #fff;
  background: #f00;
}

.swipe-action__badge {
	display: inline-block;
	font-size: 24rpx;
	line-height: 1.2;
	color: #fff;
	background-color: red;
	padding: 2rpx 6rpx;
	border-radius: 6rpx;
}

.swipe-action__content {
	flex-direction: row!important;
}

.swipe-action__custom view {
	flex-direction: row!important;
}
</style>
